<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>表单序列化</title>
		<style type="text/css">
			.t_area{
width:300px;
overflow-y:visible
}
		</style>
	</head>
	<body>
	<form id="contact">
	  <input name="user[email]" value="jsmith@example.com">
	  <input name="user[pets][]" type="checkbox" value="cat" checked>🐱
	  <input name="user[pets][]" type="checkbox" value="dog" checked>🐶
	  <input name="user[pets][]" type="checkbox" value="bird">🐦
	  <button type="button">提交</button>
	</form>
	<form id="form2">
	  <input name="email" value="jsmith@example.com">
	  <input name="pets" type="checkbox" value="cat" checked>🐱
	  <input name="pets" type="checkbox" value="dog" checked>🐶
	  <input name="pets" type="checkbox" value="bird">🐦
	  <textarea name="qiong" rows="" cols=""></textarea>
	  <button type="button" id="btn2">提交</button>
	  <select name="name">
	  	<option value="李大狗">李大狗</option>
	  	<option value="李二狗">李二狗</option>
	  </select>
	</form>
	<form id="qiong">
	  <input name="user[email]" value="jsmith@example.com">
	  <input name="user{pets}[]" type="text" value="cat" checked>
	  <input name="user{pets}[]" type="text" value="dog" checked>
	  <input name="user{pets}[]" type="text" value="bird">
	
	</form>


<textarea style='border: 1px solid #94BBE2;width:100%;' rows=5 onpropertychange='this.style.posHeight=this.scrollHeight' id=textarea onfocus='textarea.style.posHeight=this.scrollHeight'> 
 
<Br> 
</textarea> 

<div class="panel-body" data-book="感初一册" data-unit="1" data-lesson="1">
                                
                                    
                                    
                                        
                                    
                                    
                                    
                                        
                                        
                                            
                                        
                                        
                                            
                                            

                                            
                                        
                                        
                                            
                                        
                                        
                                    
                                
                            <form><table contenteditable="false" class="info" width="100%"><tbody><tr><td>课程内容1</td><td class="title"><input type="text" disabled="disabled" name="title" value="小知识：服装及颜色的学习"></td></tr><tr><td>故事梗概</td><td contenteditable="true" class="content"><textarea type="text" height="36px" disabled="disabled" name="content" value=""></textarea></td></tr><tr><td>中心思想</td><td class="summarize"><input disabled="disabled" type="text" name="summarize" value=""></td></tr></tbody></table></form><form><table contenteditable="false" class="info" width="100%"><tbody><tr><td>课程内容2</td><td class="title"><input type="text" disabled="disabled" name="title" value="游戏：关于服装的游戏"></td></tr><tr><td>故事梗概</td><td contenteditable="true" class="content"><textarea type="text" height="36px" disabled="disabled" name="content" value=""></textarea></td></tr><tr><td>中心思想</td><td class="summarize"><input disabled="disabled" type="text" name="summarize" value=""></td></tr></tbody></table></form><form><table contenteditable="false" class="info" width="100%"><tbody><tr><td>课程内容3</td><td class="title"><input type="text" disabled="disabled" name="title" value="故事：Christina and her mother"></td></tr><tr><td>故事梗概</td><td contenteditable="true" class="content"><textarea type="text" disabled="disabled" name="content" value="Christina早上穿衣服，妈妈拿来一套黄色的毛衣，蓝色的仔裤和灰色的运动鞋。但Christina不喜欢。***妈妈又拿来一套粉红色的衬衣，紫色的裤子，橘黄色的鞋，但Christina还是不喜欢。<br> 妈妈又拿来一套绿色的裙子和红色的鞋，Christina很喜欢。">Christina早上穿衣服，妈妈拿来一套黄色的毛衣，蓝色的仔裤和灰色的运动鞋。但Christina不喜欢。***妈妈又拿来一套粉红色的衬衣，紫色的裤子，橘黄色的鞋，但Christina还是不喜欢。&lt;br&gt; 妈妈又拿来一套绿色的裙子和红色的鞋，Christina很喜欢。</textarea></td></tr><tr><td>中心思想</td><td class="summarize"><input disabled="disabled" type="text" name="summarize" value=""></td></tr></tbody></table></form></div>
	<script src="js/jquery-1.12.3.js"></script>
	<script src="//cdn.bootcss.com/jquery-serialize-object/2.5.0/jquery.serialize-object.min.js"></script>
	<script>
	$("button").click(function(){
		var post=$('#contact').serializeArray();
		console.log(post);
		console.log($('#contact').serializeJSON());
		console.log($('#contact').serializeObject());
	})
	$("#btn2").click(function(){
		var post=$('#form2').serializeArray();
		console.log(post);
		console.log($('#form2').serializeJSON());
		console.log($('#form2').serializeObject());
	})
console.log($('#qiong').serializeObject());
//http://www.open-open.com/lib/view/open1417483917827.html
	</script>
	
	</body>
</html>
